/*
* 分析报告
*/
import React, { Component, PropTypes } from 'react';
import { connect } from 'react-redux';
import { Table, Row, Col } from 'antd';
import moment from 'moment';
import FeatureScores from './FeatureScores';
import GaugeChart from './charts/GaugeChart';
import AreaChart from './charts/AreaChart';
import RadarChart from './charts/RadarChart';
import utils from './utils';

const mapStateToProps = state => ({
	currentDataDate: state.featureList.currentDataDate,
	historyFeatures: state.featureList.historyFeatures,
});

const mapDispatchToProps = {
	getHistoryFeatures: query => ({
		type: 'featureList/getHistoryFeatures',
		payload: query || {},
	}),
};

@connect(mapStateToProps, mapDispatchToProps)
export default class FeaturesReport extends Component {
	static propTypes = {
		currentDataDate: PropTypes.object.isRequired,
		features: PropTypes.object,
		featuresMapping: PropTypes.array.isRequired,
		historyFeatures: PropTypes.array,
		getHistoryFeatures: PropTypes.func.isRequired,
	}
	static defaultProps = {
		features: undefined,
		historyFeatures: undefined,
	}
	componentDidMount() {
		const { currentDataDate, features: { trader } } = this.props;
		if (trader != null && currentDataDate != null) {
			this.getData(this.props);
		}
	}
	componentWillReceiveProps(nextProps) {
		if (nextProps !== this.props && nextProps.features !== this.props.features) {
			this.getData(nextProps);
		}
	}
	getData = ({ features, currentDataDate, getHistoryFeatures }) => {
		if (features) {
			const { trader } = features;
			const enddate = moment(currentDataDate).format('YYYY-MM-DD');
			const begindate = moment(currentDataDate).add(-30, 'days').format('YYYY-MM-DD');
			getHistoryFeatures({ trader, enddate, begindate });
		}
	}
	convertData = (historyFeatures) => {
		if (historyFeatures == null || historyFeatures.length === 0) {
			return null;
		}

		const featuresData = {
			all_time_pnl: [],
			eff_sharpe_ratio: [],
			trade_count: [],
		};
		historyFeatures.forEach((item, index) => {
			const dataDate = item.dataDate;
			for (const k in featuresData) {
				featuresData[k].push([dataDate, item[utils.toCamelCase(k)]]);
			}
		});

		return featuresData;
	}
	render() {
		const { features, featuresMapping, historyFeatures } = this.props;
		const featuresData = this.convertData(historyFeatures);
		const nameMap = {};
		featuresMapping && featuresMapping.forEach((item) => {
			nameMap[item.columnName] = item.showName;
		});

		const fieldsConfig1 = {
			profitability: value => value.toFixed(2),
			activity: value => value.toFixed(2),
			risk_control: value => value.toFixed(2),
			consistency: value => value.toFixed(2),
			// win_ratio: value => (value * 100).toFixed(2),
		};
		const fields1 = [];
		const data1 = [];

		for (const f in fieldsConfig1) {
			const formatter = fieldsConfig1[f];
			if (formatter) {
				data1.push(formatter(features[utils.toCamelCase(f)]));
			} else {
				data1.push(features[utils.toCamelCase(f)]);
			}
			fields1.push(nameMap[f]);
		}

		const profitScoresConfig = ['all_time_pnl', 'avg_daily_pnl', 'daily_pnl_eff', 'eff_sharpe_ratio', 'position_efficiency', 'pnl_efficiency', 'winning_day_ratio', 'streak'];
		const riskCtrlScoresConfig = ['min_neg_pnl', 'avg_min_neg_pnl', 'std_neg_eff', 'potential_risk', 'risk_over_pnl', 'eff_var'];
		const consistencyScoresConfig = ['eff_sortino_ratio', 'std_neg_eff', 'std_quantity', 'std_volume'];

		return (
			<div>
				<Row gutter={1}>
					<Col span={6}>
						{features.fdtScore &&
							<div style={{ marginTop: 40 }}>
								<GaugeChart height={180} name="HTSC Score" value={features.fdtScore} />
							</div>}
					</Col>
					<Col span={8}>
						{data1 && data1.length > 0 &&
							<div style={{ margin: 0 }}>
								<RadarChart serieName="综合交易能力" fields={fields1} data={data1} color={'#f96868'} />
							</div>}
					</Col>
					<Col span={10}>
						{featuresData &&
							<AreaChart
								serieNames={[nameMap.all_time_pnl]}
								serieDatas={[featuresData.all_time_pnl]}
								colors={['#f96868']}
								height={250}
							/>
						}
					</Col>
				</Row>

				<FeatureScores {...this.props} title="盈利能力" nameMap={nameMap} scoresConfig={profitScoresConfig} />
				<FeatureScores {...this.props} title="风险控制" nameMap={nameMap} scoresConfig={riskCtrlScoresConfig} />
				<FeatureScores {...this.props} title="稳定性" nameMap={nameMap} scoresConfig={consistencyScoresConfig} />
			</div>
		);
	}
}
